import { LockOutlined, UserOutlined } from '@ant-design/icons';
import { Button, message,Form, Input } from 'antd';
import React from 'react';
import {
    useDispatch
} from "react-redux"
import {useNavigate} from "react-router-dom";
import store from "@/store"
import styles from "./index.module.less";
// import {postLoginAsync, postLoginAsync2, postLoginAsync3} from "@/store/slices/auth";
import {useAppDispatch} from "@/hooks";
const Login = () => {
    const navigate = useNavigate();
    // const a:string = "字符串";
    // type Ta = typeof a;
    // const b:Ta ="abc";

    // type Tdispatch = typeof store.dispatch;
    // const dispatch1 = useDispatch<Tdispatch>();

    const dispatch2 = useAppDispatch();
    const onFinish = async (values:any) => {
        // 1- 调用createAsyncThunk
        //await store.dispatch(postLoginAsync3(values));
        // navigate("/");

        // 2- 调用createAsyncThunk
        //await dispatch1(postLoginAsync3(values));
        //await dispatch1(postLoginAsync2(values));
        // navigate("/");

        // 3- 自定义
        // await dispatch2(postLoginAsync3(values));
        navigate("/");



    };
    return (
        <div className={styles.login}>
            <div>
                <h1>尚医通管理系统</h1>
                <Form
                    name="normal_login"
                    className="login-form"
                    onFinish={onFinish}
                >
                    <Form.Item
                        name="username"
                        rules={[
                            {
                                required: true,
                                message: '请输入用户名!',
                            },
                        ]}
                    >
                        <Input prefix={<UserOutlined className="site-form-item-icon" />} placeholder="请输入用户名" />
                    </Form.Item>
                    <Form.Item
                        name="password"
                        rules={[
                            {
                                required: true,
                                message: '请输入密码！',
                            },
                        ]}
                    >
                        <Input
                            prefix={<LockOutlined className="site-form-item-icon" />}
                            type="password"
                            placeholder="请输入密码"
                        />
                    </Form.Item>

                    <Form.Item>
                        <Button type="primary" htmlType="submit" className="login-form-button">
                            登陆
                        </Button>
                    </Form.Item>
                </Form>
            </div>

        </div>

    );
};

export default Login;